<template>
  <view>
    <view class="mp-header">
      <view class="sys-head" :style="{ height: statusBarHeight }"></view>
      <view class="serch-box" style="height: 43px">
        <view class="serch-wrapper flex">
          <view class="logo" @tap="onreturn">
            <image
              src=""
            ></image>
            <view class="confirm">确定</view>
          </view>
        </view>
      </view>
    </view>
    <view style="height: 63px"></view>
  </view>
</template>

<script>
var statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px'
export default {
  props: ['title'],
  components: {},
  data() {
    return {
      statusBarHeight: statusBarHeight,
    }
  },
  onLoad(options) {},
  created() {
    // console.log(this.title)
  },
  methods: {
    //返回上一页
    onreturn() {
      uni.navigateBack()
    },
  },
}
</script>

<style lang="scss" scoped>
.mp-header {
  // background: linear-gradient(-38deg, #fe3a78, #fb3e44);
  background: linear-gradient(to bottom, rgba(0, 0, 0, 1), rgba(255, 255, 255, 0));
  background-size: 100% 100%;
  background-repeat: no-repeat;

  z-index: 999;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  .confirm {
    margin-left: 50rpx;
  }
  .serch-box {
    width: 100%;
    height: 120rpx;
    background-size: 100% 100%;
    padding-left: 20rpx;
    // background: linear-gradient(-38deg, #fe3a78, #fb3e44);
  }
  .serch-wrapper {
    height: 100%;
    display: flex;
    align-items: center;
    // margin-top: 20rpx;
    .logo {
      font-size: 33rpx;
      margin-right: 31rpx;
      color: #fff;
      display: flex;
      align-items: center;
    }
    image {
      width: 18rpx;
      height: 33rpx;
      margin-right: 15rpx;
    }
  }
}
</style>
